 //aui色彩 可能对应不同的评分
 let danger = '#e51c23';
 let success = '#ffffff';
 let warning = '#ffc107';

 function draw(percent, sR, coverColor) {
     let stepCount = 1;
     if (percent <= 30) {
         stepCount = 1;
     } else if (percent <= 60) {
         stepCount = 2;
     } else {
         stepCount = 3;
     }
     if (percent < 0 || percent > 100) {
         return;
     }
     if (sR < Math.PI / 2 || sR >= 3 / 2 * Math.PI) {
         return;
     }

     var canvas = document.querySelector('#canvas'),
         cxt = canvas.getContext('2d'),
         cWidth = canvas.width,
         cHeight = canvas.height,
         baseColor = '#e1e1e1',
         coverColor = coverColor || '#ffc107',
         PI = Math.PI,
         sR = sR || 1 / 2 * PI;

     var finalRadian = sR + ((PI + (PI - sR) * 2) * percent / 100);
     var step = (PI + (PI - sR) * 2) / 100;
     var text = 0; // 显示的数字

     window.requestAnimationFrame(paint);

     function paint() {
         cxt.clearRect(0, 0, cWidth, cHeight);
         var endRadian = sR + text * step;
         drawCanvas(cWidth / 2, cHeight / 2, 60, sR, sR + (PI + (PI - sR) * 2), baseColor, 2);
         drawCanvas(cWidth / 2, cHeight / 2, 60, sR, endRadian, coverColor, 3);

         var angle = 2 * PI - endRadian;
         xPos = Math.cos(angle) * 60 + cWidth / 2;
         yPos = -Math.sin(angle) * 60 + cHeight / 2;
         drawCanvas(xPos, yPos, 2, 0, 2 * PI, coverColor, 4);
         cxt.fillStyle = coverColor;
         cxt.font = '40px PT Sans';
         //  var textWidth = cxt.measureText(text).width;
         //  cxt.fillText(text*stepCount, cWidth / 2 - textWidth / 2 -12, cHeight / 2 + 10);
         text += stepCount;

         if (endRadian.toFixed(2) < finalRadian.toFixed(2)) {
             window.requestAnimationFrame(paint);
         }
     }

     function drawCanvas(x, y, r, sRadian, eRadian, color, lineWidth) {
         cxt.beginPath();
         cxt.lineCap = "round";
         cxt.strokeStyle = color;
         cxt.lineWidth = lineWidth;
         cxt.arc(x, y, r, sRadian, eRadian, false);
         cxt.stroke();
     }
 }